<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8" />
    <title>fullpage footer</title>
    <link
      href="https://cdn.bootcss.com/fullPage.js/2.9.5/jquery.fullpage.css"
      rel="stylesheet"
    />
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script>
    <script src="https://cdn.bootcss.com/fullPage.js/2.9.5/jquery.fullpage.js"></script>
    <link rel="stylesheet" href="../../css/common/common.css" />
    <script src="../../js/common/common.js" async></script>
    <style>
      .section {
        text-align: center;
        font: 30px "Microsoft Yahei";
        color: #fff;
      }

      .header,
      .footer {
        /* height: 100px; */
      }
    </style>
    <script>
      $(function () {
        $("#stumpx").fullpage({
          sectionsColor: ["#1bbc9b", "#4BBFC3", "#7BAABE", "#f90"],
        });
      });
    </script>
  </head>
  <body>
    <div id="stumpx">
      <!-- <div class="section fp-auto-height header">
        <h3>第一屏 header</h3>
      </div> -->
      <div class="section">
        <h3>第二屏</h3>
      </div>
      <div class="section">
        <h3>第三屏</h3>
      </div>
      <div class="section fp-auto-height footer">
        <h3>第四屏 footer</h3>
      </div>
    </div>
  </body>
</html>
